{namespace mazepage}

/**
 * This is a Closure Template.  Build with:
 * java -jar ../_soy/SoyToJsSrcCompiler.jar --outputPathFormat template.js --srcs template.soy
 */

/**
 * Web page structure.
 */
{template .start}
  <table width="100%" height="100%">
    <tr>
      <td width="410" valign="top">
        <h1><a href="http://blockly.googlecode.com/">Blockly</a> &gt;{sp}
            <a href="../index.html">Apps</a> &gt; {$ij.MSG.title}</h1>

        <p class="levelLine">{$ij.MSG.level}: &nbsp;
        {for $i in range(1, 11)}
          {if $i == $ij.level}
            <span class="tab" id="selected">{$i}</span>
          {else}
            <a class="tab" href="?level={$i}">{$i}</a>
          {/if}
        {/for}
        </p>

        <div id="bubble">
          <div id="hint">{$ij.MSG.hints[$ij.level]}</div>
        </div>
        <div id="capacity"></div>
        <img id="pegman_bubble" height=42 width=55 src="pegman_bubble.png">

        <div>
          <svg xmlns="http://www.w3.org/2000/svg" version="1.1" id="svgMaze" width="400px" height="400px">
        </div>

        <table width="100%">
          <tr>
            <td style="width: 190px; text-align: center">
              <button title="{$ij.MSG.codeTooltip}" onclick="Blockly.Apps.showCode();">
                <img src='../../media/1x1.gif' class="code">
              </button>
              <button id="linkButton" title="{$ij.MSG.linkTooltip}" onclick="BlocklyStorage.link();">
                <img src='../../media/1x1.gif' class="link">
              </button>
                <button id="randomizeButton" title="$ij.MSG.randomizeTooltip1" onclick="Maze.randomizeMarkers();" style="display: none">
                <img src='../../media/1x1.gif' class="random">
              </button>
            </td>
            <td style="width: 15px;">
              <img id="spinner" style="visibility: hidden;" src="loading.gif" height=15 width=15>
            </td>
            <td>
              <button id="runButton" class="launch" onclick="Maze.runButtonClick();">
                {$ij.MSG.runProgram}
              </button>
              <button id="resetButton" class="launch" onclick="Maze.resetButtonClick();" style="display: none">
                {$ij.MSG.resetProgram}
              </button>
            </td>
          </tr>
        </table>
      </td>

      <td valign="top">
        <script type="text/javascript" src="../../blockly_compressed.js"></script>
        <script type="text/javascript" src="../../generators/javascript.js"></script>
        <script type="text/javascript" src="../common.js"></script>
        <script type="text/javascript">
          Blockly.Apps.loadLanguageScripts(languageSrc);
        </script>
        <script type="text/javascript" src="blocks.js"></script>
        {call .toolbox /}
        <div id="blockly"></div>
      </td>
    </tr>
  </table>
{/template}

/**
 * Toolboxes for each level.
 */
{template .toolbox}
  <xml id="toolbox" style="display: none">
    <block type="maze_moveForward"></block>
    <block type="maze_turn"><title name="DIR">turnLeft</title></block>
    <block type="maze_turn"><title name="DIR">turnRight</title></block>
    {if $ij.level > 2}
      <block type="maze_forever"></block>
      {if $ij.level == 6}
        <block type="maze_if"><title name="DIR">isPathLeft</title></block>
      {elseif $ij.level > 6}
        <block type="maze_if"></block>
        {if $ij.level > 8}
          <block type="maze_ifElse"></block>
        {/if}
      {/if}
    {/if}
  </xml>
{/template}
